<!-- 详情 -->

<template>
  <WebForm v-if="readyOne" labelPosition="top">
    <MyBase />

    <MyWelcome />

    <MyQuestion />

    <MyThanks />

    <MyFooter />
  </WebForm>
</template>

<script>
// ============================== 导入依赖 ============================== //

import CORE from '@/CORE'
import store from './store'

// ============================== 导出组件 ============================== //

export default {
  /**
   * 名称定义 (实际使用名称)
   */
  name: 'Detail',

  /**
   * 混入列表 (配置选项合并)
   */
  mixins: [CORE.mixStore(store)],

  /**
   * 组件导入 (Abc.vue + Abc/index.vue)
   */
  ...CORE.components(require.context('./', true, /vue$/)),

  /**
   * 属性注册 (抽取以便查阅)
   */
  props: {
    id: { type: String, required: true }, // 问卷 ID
  },

  /**
   * 监听属性 (深度 deep 首次 immediate)
   */
  watch: {
    /**
     * 监听问卷 ID
     */
    id: {
      immediate: true,
      handler(id) {
        this.infoParam.answerId = this.one.answerId = location.search.slice(1) // 记录答卷人 uaaUserId
        this.infoParam.id = this.one.id = id
        this.startInfo()
      },
    },

    /**
     * 监听信息就绪
     */
    readyInfo(ready) {
      if (ready) {
        document.title = this.info.title

        this.one.id = this.info.id
        this.startOne()
      }
    },

    /**
     * 监听提交就绪
     */
    readySubmit(ready) {
      ready && this.startOne()
    },
  },
}
</script>
